<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"   
      xmlns:p="http://primefaces.org/ui" 
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>Why are you having trouble signing in?</title>
    </h:head>
    <h:body style="color: #3366ff; font-family: sans-serif">
        <h1>Why are you having trouble signing in?</h1>
        
        <h:form>
                <p:outputPanel id="customPanel" style="margin-bottom:10px">
                    <p:selectOneRadio id="customRadio" value="#{problemsBean.loginProblem}" layout="custom">
                        <f:selectItem itemLabel="I forgot my password." itemValue="true" />
                        <f:selectItem itemLabel="I don't remember my user name." itemValue="false" />
                    </p:selectOneRadio>

                    <h:panelGrid columns="2" cellpadding="5">
                        <p:radioButton id="opt1" for="customRadio" itemIndex="0" />
                        <h:outputLabel for="opt1" value="I forgot my password." />

                        <p:radioButton id="opt2" for="customRadio" itemIndex="1" />
                        <h:outputLabel for="opt2" value="I don't remember my user name." />
                    </h:panelGrid>
                        
                    <h:panelGrid columns="2" cellpadding="5">    
                        <h:outputLabel for="email" value="Please enter your email:" />                    
                        <p:inputText id="email" value="#{problemsBean.email}" size="35"/>
                            <!--<f:validateRegex pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[A-Za-z0-9-]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$"  />
                        </p:inputText>-->
                        <p:message for="email" />

                    </h:panelGrid>
                </p:outputPanel>
                
                
                <p:commandButton value="Submit" update="display" icon="ui-icon-check" action="#{problemsBean.submitProblem()}" oncomplete="PF('dlg').show()"/>
                <p:commandButton value="Cancel" action="home"/>
                

                <p:dialog modal="true" resizable="false" widgetVar="dlg" header="Done :)" showEffect="clip">
                    <h:panelGrid columns="1" id="display" columnClasses="label,value" style="text-align: center">
                        <h:outputText value="If the provided email (#{problemsBean.email}) is correct," />
                        <h:outputText value="you will receive #{problemsBean.message}" />
                        <p:commandButton id="backToLogin" value="Thanks" action="home" />
                    </h:panelGrid>
                </p:dialog>


        </h:form>
    </h:body>
</html>


